import classNames from 'classnames'
import React from 'react'
import style from './Index.module.less'
import { List } from 'antd'

function Main ({ data, loading, value, onChange = () => {} }) {
  return (
    <div className={style.container}>
      <List
        dataSource={data}
        loading={loading}
        renderItem={(item, i) => {
          let s = classNames(style['type-li'])
          if (value && value === item) {
            s = classNames(style['type-li'], style.active)
          }
          return (
            <li key={i} className={s} onClick={() => onChange(item)}>{item.type}</li>
          )
        }}
      />
    </div>
  )
}

export default Main
